{% extends 'base.html' %}

{% block title_suffix %}
 | Questions
{% endblock %}

{% block all_content %}
    {% load pagination %}
    <div id="filter" class="well well-small">
        <legend>Filter the List of Questions</legend>
        <form action="{% url 'test.views.create_new_exercise' page_id=page_id %}" method="get">
            <fieldset>
                <input type="hidden" name="page" value="{{ questions.number }}" />
                <div class="form-horizontal">
                    <div class="control-group">
                        <label class="control-label" for="difficulty">
                            Text Filter
                        </label>
                        <div class="controls">
                            <input name="filter" type="text" value="{{ request.GET.filter }}"/>
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label" for="difficulty">
                            Difficulty
                        </label>
                        <div class="controls">
                            <select id="difficulty" name="difficulty">
                                <option value=""></option>
                                {% for difficulty in difficulties %}
                                    <option value="{{ difficulty.id }}" {% if request.GET.difficulty == difficulty.id|slugify %}selected="selected"{% endif %}>
                                        {{ difficulty }}
                                    </option>
                                {% endfor %}
                            </select>
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label" for="type">
                            Question type
                        </label>
                        <div class="controls">
                            <select id="type" name="type">
                                <option value=""></option>
                                {% for question_key, question_type  in question_types.items %}
                                    <option value="{{ question_key }}" {% if request.GET.type == question_key %}selected="selected"{% endif %}>
                                        {{ question_type.name }}
                                    </option>
                                {% endfor %}
                            </select>
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label" for="type">
                            Page
                        </label>
                        <div class="controls">
                            <select id="question_page" name="question_page">
                                <option value=""></option>
                                {% for question_page  in question_pages %}
                                    <option value="{{ question_page.id }}" {% if request.GET.question_page == question_page.id %}selected="selected"{% endif %}>
                                        {{ question_page.title }}
                                    </option>
                                {% endfor %}
                            </select>
                        </div>
                    </div>
                </div>
            </fieldset>
        <form>
        <div class="form-actions">
            <button id="filter-questions" class="btn btn-primary">
                Filter Questions
            </button>
            <a id="clear-questions-filter" class="btn" href=".">
                Clear Filter
            </a>
        </div>
    </div>
    {% if available_questions %}
        <table class="table table-bordered table-striped table-condensed table-hover">
            <tr>
                <th>Id</th>
                <th>Question</th>
                <th>Difficulty</th>
                <th>Type</th>
                <th>Page</th>
                <th>Created by</th>
                <th>Created on</th>
                <th>Modified by</th>
                <th>Modified on</th>
                <th style="text-align: center;">Edit</th>
                <th style="text-align: center;">Trash</th>
            </tr>
            {% for question in available_questions %}
                <tr>
                    <td><a href="{% url 'question.views.show' question_id=question.id %}">{{ question.id }}</a></td>
                    <td>{{ question|truncatechars:50 }}</td>
                    <td>{{ question.difficulty|truncatechars:30 }}</td>
                    <td>{{ question.question_type|truncatechars:50 }}</td>
                    <td>{{ question.page.title|truncatechars:50 }}</td>
                    <td>{{ question.created_by }}</td>
                    <td>{{ question.created }}</td>
                    <td>{{ question.modified_by }}</td>
                    <td>{{ question.modified }}</td>
                    <td style="text-align: center;"><a href="{% url 'question.views.edit' question_id=question.id %}"><i class="icon-edit"></i></a></td>
                    <td style="text-align: center;"><a href="{% url 'question.views.remove' question_id=question.id %}"><i class="icon-trash"></i></a></td>
                </tr>
            {% endfor %}
        </table>
        {% paginate available_questions %}
    {% else %}
        <div class="alert alert-info">
            <p>No question(s) matches this filter.</p>
        </div>
    {% endif %}
{% endblock %}

